<!DOCTYPE html> 
<html>
<head>
<meta charset="utf-8">
<title>Partiest</title>
<link href="jquery-mobile/jquery.mobile-1.1.1.min.css" rel="stylesheet" type="text/css"/>
<link href="css/styles.css" rel="stylesheet" type="text/css"/>


<script src="jquery-mobile/jquery.js" type="text/javascript"></script>
<script src="jquery-mobile/jquery.mobile-1.1.1.min.js" type="text/javascript"></script>
<script src="js/cordova-1.9.0.js" type="text/javascript"></script>
<script src="js/shoppinglist.js" type="text/javascript"></script>

<!-- <script src="js/fastclick.js" type="text/javascript"></script> -->
<script src="js/loadingIndicator.js" type="text/javascript"></script>
<script src="js/phonegap-toast.js" type="text/javascript"></script>

<meta name="viewport" content="width=device-width, initial-scale=1"> 

</head> 
<body> 
<span id="fastclick">

<!--main menu-->
<div data-role="page" id="main_menu">
	<div data-role="header" data-position="fixed" class="purple-blue-title-bar"  data-backbtn="false">
        <h1>Partiest</h1>
        <div class="ui-btn-right"><a href="#help"><img src="img/about.png" width="30dp" height="30dp"/></a></div>
  	</div>
    
    <div data-role="content" data-theme="d">
      <div class="ui-grid-b">
        <div class="ui-block-b" style="height:100px">
			<div class="center-wrapper">
                <a href="index.html#shoppinglist" id="shoppinglist_button"></a>
            </div>
        </div>
        <div class="ui-block-b" style="height:100px">
        	<input type="button" value="retry" onclick="checkConnection();" />
		</div>
      </div>
    </div>
    <style>
    		#invitations .ui-icon { background:  url(img/nav_invitations.png) 50% 50% no-repeat;  }
			#settings .ui-icon { background:  url(img/nav_settings.png) 50% 50% no-repeat;  }
    </style>
<div data-role="footer" data-position="fixed" data-theme="c" class="custom-nav">
	<div data-role="navbar" data-iconpos="top" class="custom-nav"><!-- footer nav bar -->
		<ul>
			<li><a href="#invitations" id="invitations" data-icon="custom">Invitations</a></li>
			<li><a href="#settings" id="settings" data-icon="custom">Settings</a></li>
		</ul>
	</div><!-- /navbar -->
    
</div>
</div>

<!--help page-->
<div data-role="page" id="help">
  <div data-role="header" class="purple-blue-title-bar" data-backbtn="false">
  	<span class="ui-btn-left"><a class="goback_button" href="#" onClick="goBack();"></a></span>
    <h1>Help</h1>
  </div>
  <div data-role="content" data-theme="d">Help information here....</div>
</div>


<!--settings page-->
<div data-role="page" id="settings">
  <div data-role="header" class="purple-blue-title-bar" data-backbtn="false">
  	<span class="ui-btn-left"><a class="goback_button" href="#" onClick="goBack();"></a></span>
    <h1>Settings</h1>
  </div>
  <div data-role="content">Content</div>
</div>
</span> <!-- end fastclick -->
</body>
</html>
